

<el-dialog id="form" v-loading="loading" :close-on-click-modal="false" v-cloak title="资源库" :visible.sync="dialogVisible" width="50%">
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="right" size="small">
            <!--名称-->
	        <el-form-item  label="名称" prop="fileName">
	            <el-input
                        v-model="form.fileName"
                         :disabled="false"
                          :readonly="false"
                          :style="{width:  '100%'}"
                          :clearable="true"
                        placeholder="请输入名称">
                </el-input>
	        </el-form-item>   
        <!--图片文件-->
    
        <el-form-item  label="图片文件" prop="fileUrls">
             <ms-upload
                    v-model="form.fileUrls"
                    :action="ms.base+'/file/upload.do'"
                    :limit="1"
                    :disabled="false"
                    :data="{uploadPath:'/cmsMessage/','isRename':true,'appId':true}"
                    accept="image/*"
                    list-type="picture-card">
                <i class="el-icon-plus"></i>
                <div slot="tip" class="el-upload__tip">最多上传1张图片</div>
            </ms-upload>
        </el-form-item>
   
    </el-form>
    <div slot="footer">
        <el-button size="mini" @click="dialogVisible = false">取消</el-button>
        <el-button size="mini" type="primary" @click="save()" :loading="saveDisabled">保存</el-button>
    </div>
</el-dialog>
<script>
    var form = new Vue({
        el: '#form',
        data:function() {
            return {
                loading:false,
                saveDisabled: false,
                dialogVisible:false,
                //表单数据
                form: {
                    // 名称
                    fileName:'',
                    // 图片文件
                    fileUrls: [],
                    //图片类型
                    fileType:'01',
                },
                rules:{
                        // 名称
                        fileName: [{"required":true,"message":"名称不能为空"},{"min":0,"max":1024,"message":"名称长度必须为0-1024"}],
                        // 图片文件
                        fileUrls: [{"required":true,"message":"图片文件不能为空"}],
                },

            }
        },
        watch:{

            dialogVisible:function (v) {
                if(!v){
                    this.$refs.form.id=null;
                    this.$refs.form.resetFields();
                }
            }
        },
        components:{
        },
        computed:{
        },
        methods: {

            open:function(id){
                if (id) {
                    this.get(id);
                }
                this.$nextTick(function () {
                    this.dialogVisible = true;

                })
            },
            save:function() {
                var that = this;
                var url = ms.manager + "/cmsMessage/cmsResourcePool/save.do"
                if (that.form.id > 0) {
                    url = ms.manager + "/cmsMessage/cmsResourcePool/update.do";
                }
                this.$refs.form.validate(function(valid) {
                    if (valid) {
                        that.saveDisabled = true;
                        var form = JSON.parse(JSON.stringify(that.form));
                        ms.http.post(url, form).then(function (res) {
                            if (res.result) {
                                that.$notify({
                                    title: "成功",
                                    message: "保存成功",
                                    type: 'success'
                                });
                                that.dialogVisible = false;
                                indexVue.list();
                            } else {
                                that.$notify({
                                    title: "错误",
                                    message: res.msg,
                                    type: 'warning'
                                });
                            }

                            that.saveDisabled = false;
                        }).catch(function (err) {
                            console.err(err);
                            that.saveDisabled = false;
                        });
                    } else {
                        return false;
                    }
                })
            },

            //获取当前资源库
            get:function(id) {
                var that = this;
                this.loading = true
                ms.http.get(ms.manager + "/cmsMessage/cmsResourcePool/get.do", {"id":id}).then(function (res) {
                    that.loading = false
                    if(res.result&&res.data) {
                   
                        that.form = res.data;
                    }
                });
            },
        },
        created:function() {
            var that = this;
        }
    });

</script>